<template>
    <el-row id="cpts-collect-datas">
      <el-row v-if="!isViewShow" class="permission">
        没有权限!
      </el-row>
      <el-card v-else class="box-card">


      <div slot="header" class="clearfix">
        <span>采集数据管理</span>
        <el-button  style="float: right; padding: 6px 6px" type="primary" @click="handleSearch">筛选<i class="el-icon-search el-icon--right"></i></el-button>
       <!-- <el-button style="float: right; padding: 6px 6px;margin-right: 20px" type="primary">上传<i class="el-icon-upload el-icon&#45;&#45;right"></i></el-button>-->
        <el-button :disabled="!isViewEdit" style="float: right; padding: 6px 6px;margin-right: 10px" type="primary" @click="handleAdd">添加<i class="el-icon-plus el-icon--right"></i></el-button>
        <el-button :disabled="!isViewEdit" style="float: right; padding: 6px 6px;margin-right: 10px" type="primary" @click="handleExport">导出<i class="el-icon-document el-icon--right"></i></el-button>
      </div>

      <el-table
        :data="tableData"
        stripe
        border
        style="width: 100%;"
        max-height="644">
        <el-table-column
          align="center"
          prop="nodeName"
          label="采集节点名称">
        </el-table-column>
        <el-table-column
          align="center"
          prop="code"
          label="采集节点编码">
        </el-table-column>
        <!--<el-table-column
          align="center"
          prop="value"
          width="120px"
          label="采集值">
        </el-table-column>-->
        <el-table-column
          :formatter="statusFormatter"
          align="center"
          prop="status"
          width="120px"
          label="节点状态">
        </el-table-column>
        <el-table-column
          :formatter="inputTypeFormatter"
          align="center"
          prop="inputType"
          label="采集类型">
        </el-table-column>
        <el-table-column
          :formatter="statTypeFormatter"
          align="center"
          prop="statType"
          width="120px"
          label="采集频率">
        </el-table-column>
        <el-table-column
          :formatter="parentNodeTypeFormatter"
          align="center"
          prop="parentNodeType"
          label="数据范围">
        </el-table-column>
        <el-table-column
          align="center"
          prop="statDateStr"
          label="周期起始时间">
        </el-table-column>
        <el-table-column
          align="center"
          prop="uploadDateStr"
          label="上传时间">
        </el-table-column>
        <el-table-column label="操作"  align="center"  fixed="right"  width="180px">
          <template slot-scope="scope">
            <el-button :disabled="!isViewEdit"
              size="mini"
              type="text"
              @click="handleInfo(scope.$index, scope.row)">详情</el-button>
            <el-button :disabled="!isViewEdit"
              size="mini"
              type="text"
              @click="handleHistory(scope.$index, scope.row)">历史</el-button>
            <el-button :disabled="!isViewEdit"
              type="mini"
              size="text"
              @click="handleSetting(scope.$index, scope.row)">配置</el-button>
            <el-button :disabled="!isViewEdit"
              size="mini"
              type="text"
              @click="handleDelete(scope.$index, scope.row)">删除</el-button>
          </template>
        </el-table-column>

      </el-table>

      <!--分页-->
      <div style="text-align: center;margin-top: 10px;">
        <el-pagination
          background
          layout="prev, pager, next"
          :total="paginationCount"
          :current-page="currentPage"
          :page-size="pageSize"
          @current-change="currentChange">
        </el-pagination>
      </div>


      </el-card>

      <!--筛选弹窗-->
      <el-dialog :visible.sync="searchDialogShow" style="height: 400px">

        <el-row slot="title">
          <span style="font-size: 18px">筛选</span>  <el-button @click="handleSeacherSubmit" style="margin-left: 1240px; padding: 6px 10px"type="primary"  :loading="false">提交</el-button>
        </el-row>

        <el-row>
          <el-form  label-width="140px">
            <el-row>
              <el-col :span="8">
                <el-form-item label="采集类型" >
                  <el-select placeholder="请选择" clearable  v-model="seacherFrom.inputType">
                    <el-option
                      v-for="item in dataCollectTypeFields"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="采集频率"  >
                  <el-select placeholder="请选择" clearable  v-model="seacherFrom.statType">
                    <el-option
                      v-for="item in collectStatTypeFields"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="数据范围">
                  <el-select placeholder="请选择" clearable  v-model="seacherFrom.parentNodeType">
                    <el-option
                      v-for="item in fatherFields"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="8">
                <el-form-item label="节点状态" >
                  <el-select placeholder="请选择" clearable v-model="seacherFrom.status">
                    <el-option
                      v-for="item in nodeStatusFields"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </el-row>
      </el-dialog>

      <!--添加弹窗-->
      <el-dialog :visible.sync="addDialogShow" style="height: 500px">

        <el-row slot="title">
          <span style="font-size: 18px">新增</span>  <el-button @click="handleAddSubmit('ruleFormAdd')" style="margin-left: 1240px; padding: 6px 10px" type="primary"  :loading="false">提交</el-button>
        </el-row>

        <el-row>
          <el-form  :model="ruleFormAdd" ref="ruleFormAdd" :rules="rulesAdd" label-width="140px">
            <el-row>
              <el-col :span="8">
                <el-form-item label="采集节点名称" prop="nodeName">
                  <el-input v-model="ruleFormAdd.nodeName"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="数据范围" prop="parentNodeType">
                  <el-select v-model="ruleFormAdd.parentNodeType" placeholder="请选择" @change="onFatherSelectChange">
                    <el-option
                       v-for="item in fatherFields"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="数据范围节点">
                  <el-cascader
                    v-model="ruleFormAdd.processId"
                     placeholder="请选择"
                    :disabled="fatherCascadersForbidden"
                    :options="fatherOptions"
                    @change="handleFatherCascadersChange">
                  </el-cascader>

                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="8">
                <el-form-item label="采集数据分类" prop="collectedDataTypeId">
                  <el-select placeholder="请选择" v-model="ruleFormAdd.collectedDataTypeId" @change="onCollectTypeChange">
                    <el-option
                      v-for="item in collectTypeFields"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="采集数据子类" prop="subclassId">
                  <el-cascader
                    v-model="ruleFormAdd.subclassId"
                    placeholder="请选择"
                    :options="collectChildOptions">
                  </el-cascader>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="能源用途" prop="energyUseId">
                  <el-cascader
                    v-model="ruleFormAdd.energyUseId"
                    placeholder="请选择"
                    :options="energyUseOptions">
                  </el-cascader>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="8">
                <el-form-item label="采集类型" prop="inputType">
                  <el-select placeholder="请选择" v-model="ruleFormAdd.inputType">
                    <el-option
                      v-for="item in dataCollectTypeFields"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="采集频率" prop="statType">
                  <el-select placeholder="请选择" v-model="ruleFormAdd.statType">
                    <el-option
                      v-for="item in collectStatTypeFields"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </el-row>
      </el-dialog>

      <!--详情弹窗-->
      <el-dialog :visible.sync="infoDialogShow">

        <el-row slot="title">
          <span style="font-size: 18px">详情</span> <!-- <el-button style="margin-left: 1260px; padding: 6px 6px" type="primary" icon="el-icon-edit" circle></el-button>-->
        </el-row>

        <el-row>
          <el-collapse v-model="activeName" accordion>
            <el-collapse-item title="基础数据" name="1">
              <el-form  label-width="140px" >
                <el-row>
                  <el-col :span="8">
                    <el-form-item label="采集节点名称">
                      <el-input v-model="infoForm.nodeName" :disabled="settingForbidden"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item label="采集节点编码">
                      <el-input v-model="infoForm.code" :disabled="settingForbidden"></el-input>
                    </el-form-item>
                  </el-col>
                 <!-- <el-col :span="8">
                    <el-form-item label="采集值">
                      <el-input ></el-input>
                    </el-form-item>
                  </el-col>-->
                </el-row>

                <el-row>
                  <el-col :span="8">
                    <el-form-item label="采集类型" >
                      <el-input v-model="infoForm.inputType" :disabled="settingForbidden"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item label="采集频率">
                      <el-input v-model="infoForm.statType" :disabled="settingForbidden"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item label="数据范围">
                      <el-input v-model="infoForm.parentNodeType" :disabled="settingForbidden"></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>

                <el-row>
                  <el-col :span="8">
                    <el-form-item label="数据有效性">
                      <el-input v-model="infoForm.valid" :disabled="settingForbidden"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item label="周期起始时间">
                      <el-input v-model="infoForm.statDateStr" :disabled="settingForbidden"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item label="上传时间">
                      <el-input v-model="infoForm.uploadDateStr" :disabled="settingForbidden"></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>

                <el-row>
                  <el-col :span="8">
                    <el-form-item label="采集数据分类">
                      <el-input v-model="infoForm.collectedDataTypeName" :disabled="settingForbidden"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item label="采集数据子类">
                      <el-input v-model="infoForm.subclassName" :disabled="settingForbidden"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item label="能源用途">
                      <el-input v-model="infoForm.energyUseName" :disabled="settingForbidden"></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>

                <el-row>
                  <el-col :span="8">
                    <el-form-item label="所属工序">
                      <el-input v-model="infoForm.processName" :disabled="settingForbidden"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item label="所属工序单元">
                      <el-input v-model="infoForm.processElementName" :disabled="settingForbidden"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8">
                    <el-form-item label="所属重点能耗设备">
                      <el-input v-model="infoForm.facilityName" :disabled="settingForbidden"></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
              </el-form>
            </el-collapse-item>
            <el-collapse-item title="配置数据" name="2">
              <el-table
                :data="infoForm.collectedParameterConfigurationEntities"
                stripe
                max-height="336"
                style="width: 100%">
                <el-table-column
                  prop="parameter"
                  label="参数名">
                </el-table-column>
                <el-table-column
                  prop="tagName"
                  label="变量">
                </el-table-column>
              </el-table>
              <el-row style="margin-top: 20px">
                <span>计算关系</span> <el-input v-model="infoForm.parameterCalculateRelationship" :disabled="settingForbidden" :rows="4" type="textarea"></el-input>
              </el-row>
            </el-collapse-item>
          </el-collapse>
        </el-row>
      </el-dialog>

      <!--配置弹窗-->
      <el-dialog title="配置" :visible.sync="settingDialogShow">
        <el-row slot="title">
          <span style="font-size: 18px">配置</span>  <el-button @click="handleSettingInfo" style="margin-left: 1240px; padding: 6px 10px"type="primary"  :loading="false">提交</el-button>
        </el-row>
        <el-form  label-width="80px">
          <el-row>
            <el-col :span="8">
              <el-form-item label="参数名">
                <el-input  v-model="settingForm.settingTagName"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="变量绑定">
                <el-select  placeholder="请选择" v-model="settingForm.settingVarieties">
                  <el-option
                    v-for="item in settingFields"
                    :key="item.id"
                    :label="item.detailTagName"
                    :value="item.id">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-button style="padding: 12px 12px" type="primary" @click="addSettingItem">添加</el-button>
            </el-col>
          </el-row><hr>

          <el-table
            :data="settingForm.itemTableData"
            stripe
            max-height="310"
            style="width: 100%">
            <el-table-column
              prop="parameter"
              label="参数名">
            </el-table-column>
            <el-table-column
              prop="tagName"
              label="变量">
            </el-table-column>
            <el-table-column label="操作">
              <template slot-scope="scope">
                <el-button
                  size="mini"
                  type="danger"
                  @click="handleItemDelete(scope.$index, scope.row)">删除</el-button>
              </template>
            </el-table-column>
          </el-table><hr style="margin-top: 20px;margin-bottom: 20px">

          <el-row>
            <el-col :span="8">
              <el-form-item label="计算关系" >
                <el-input :rows="4" type="textarea" v-model="settingForm.calculateValue"></el-input>
              </el-form-item>
            </el-col>
          </el-row>

        </el-form>
      </el-dialog>

      <!--历史弹窗-->
      <el-dialog :visible.sync="historyDialogShow">
        <el-row slot="title">
          <span style="font-size: 18px">历史数据</span>
        </el-row>

        <el-row>
          <el-date-picker
            :disabled="infoForbidden"
            :type="pickerType"
            :value-format="histotyDateFormat"
            @change="onPickerChange"
            v-model="histotyDate"
            placeholder="选择日期时间">
          </el-date-picker>
        </el-row>

        <el-row>
          <BaseEchartsComponent ref="cptsCdsLineChart" :id="'cpts-cds-chart'" :data="lineChartsOptions" />
        </el-row>

      </el-dialog>

      <!--警告弹窗-->
      <el-dialog
        style="height: 360px"
        title="提示"
        :visible.sync="warnDialogShow"
        width="30%">
        <span>该数据正在被使用,删除会影响数据的正常上报。确定需要删除么?</span>
        <span slot="footer" class="dialog-footer">
            <el-button @click="warnDialogShow = false">取 消</el-button>
            <el-button type="primary" @click="handlerDeleteForWarn">确 定</el-button>
         </span>
      </el-dialog>

      <!--导出弹窗-->
      <el-dialog :visible.sync="exportDialogShow" style="height: 500px">

        <el-row slot="title">
          <span style="font-size: 18px">导出</span>  <el-button @click="handleExportSubmit('exportForm')" style="margin-left: 1240px; padding: 6px 10px" type="primary"  :loading="false">确定</el-button>
        </el-row>

        <el-row>
          <el-form :model="exportForm" ref="exportForm" :rules="rulesExport" label-width="140px">
            <el-row>
              <el-col :span="8">
                <el-form-item label="采集频率" prop="statType">
                  <el-select placeholder="请选择" @change="onExportSelectChange" v-model="exportForm.statType">
                    <el-option
                      v-for="item in collectStatTypeFields2"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>

              <el-col :span="8">
                <el-form-item label="采集时间" prop="exportDate">
                  <el-date-picker
                    :type="exportPickerType"
                    :value-format="exportDateFormat"
                    @change="onExportPickerChange"
                    v-model="exportForm.exportDate"
                    placeholder="选择日期时间">
                  </el-date-picker>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </el-row>
      </el-dialog>

    </el-row>


</template>


<script>
  import BaseEchartsComponent from "../BaseEcharts/index";
  import myEchartsOptions from '../../chart-options/echartsOptions'
  import {DateTime} from '../../utils/dateTime'
    export default {
        name: "collectDatas",
      components: {BaseEchartsComponent},
      data(){
          return {
            fileName: '',
            isViewShow: false,
            isViewEdit: false,
            pickerType:'date',
            exportPickerType:'date',
            histotyDate: new Date(),
            exportDate: new Date(),
            histotyDateFormat: 'yyyy-MM-dd',
            exportDateFormat: 'yyyy-MM-dd',
            activeName:'1',
            currentNodeId: '',
            chooseId:"",
            fatherCascadersForbidden: false,
            settingForbidden: true,
            infoForbidden: false,

            fatherCascadersValue: '',
            energyUseValue: '',
            fatherSelectValue: '',
            dataCollectTypeSelectValue:'',
            collectStatTypeSelectValue:'',
            collectTypeValue: '',
            collectChildValue:'',
            paginationCount: 11,
            currentPage:1,
            pageSize:11,
            treeDatas: [],
            collectDataType:[],
            seacherFrom:{
              inputType:'',
              statType:'',
              parentNodeType:'',
              status:''
            },
            settingForm:{
              settingTagName: '',
              settingVarieties: '',
              itemTableData:[] ,
              calculateValue:''
            },
            exportForm:{
              statType: '',
              exportDate: '',
            },
            rulesExport: {
              statType:[
                { required: true, message: '请输入', trigger: 'blur' },
              ],
              exportDate:[
                { required: true, message: '请输入', trigger: 'blur' },
              ],
            },
            infoForm:{
                id: "",
                nodeName: "",
                code: "",
                parentNodeType: '',
                collectedDataTypeId: "",
                energyUseClassificationId: "",
                energyUseSubitemId: "",
                processId: "",
                inputType: '',
                statType: '',
                parameterCalculateRelationship: "",
                tagCalculateRelationship: "",
                subclassId: "",
                status: '',
                dataValue: '',
                dataUnit: "",
                statDateStr: "",
                uploadDateStr: "",
                valid: 0,
                collectedParameterConfigurationEntities: [],
                processName: "",
                processElementName: null,
                facilityName: null,
                collectedDataTypeName: "",
                subclassName: "",
                energyUseName: ""
            },
            ruleFormAdd:{
              nodeName: "",
              parentNodeType: '',
              collectedDataTypeId: "",
              processId: [],
              deleteId:'',
              inputType: '',
              statType: '',
              subclassId: [],
              energyUseId:[]
            },
            rulesAdd: {
              nodeName:[
                { required: true, message: '请输入', trigger: 'blur' },
              ],
              parentNodeType:[
                { required: true, message: '请输入', trigger: 'blur' },
              ],
              collectedDataTypeId:[
                { required: true, message: '请输入', trigger: 'blur' },
              ],
              subclassId:[
                { required: true, message: '请输入', trigger: 'blur' },
              ],
              energyUseId:[
                { required: true, message: '请输入', trigger: 'blur' },
              ],
              inputType:[
                { required: true, message: '请输入', trigger: 'blur' },
              ],
              statType:[
                { required: true, message: '请输入', trigger: 'blur' },
              ]
            },
            tableData: [],

            addDialogShow:false,
            infoDialogShow:false,
            settingDialogShow: false,
            searchDialogShow: false,
            historyDialogShow: false,
            warnDialogShow: false,
            exportDialogShow: false,
            lineChartsOptions: this.validateGlobal.cloneObject(myEchartsOptions.lineChartsOption),
            fatherFields:[{value: 1,label: '全厂'},{value: 2,label: '工序'},{value: 3,label: '工序单元'},{value: 4,label: '能耗设备'}],
            collectStatTypeFields:[{value: 0,label: '实时'},{value: 1,label: '日'},{value: 2,label: '月'},{value: 3,label: '年'}],
            collectStatTypeFields2:[{value: 1,label: '日'},{value: 2,label: '月'},{value: 3,label: '年'}],
            nodeStatusFields:[{value: 0,label: '缺失'},{value: 1,label: '正常'}],
            dataCollectTypeFields:[{value: 1,label: '管理信息系统'},{value: 2,label: '生产监控管理系统'},{value: 3,label: '分布式控制系统'}
            ,{value: 4,label: '现场仪表'} ,{value: 5,label: '手工填报'}],
            collectTypeFields:[],
            settingFields:[],
            fatherOptions:[],
            energyUseOptions:[],
            collectChildOptions:[],
          }
      },
      mounted(){
        let _that = this
        let obj = this.validateGlobal.getPermission(22)
        this.isViewShow = obj.isViewShow
        this.isViewEdit = obj.isViewEdit

        this.lineChartsOptions.xAxis[0].data = []
        this.lineChartsOptions.series[0].data = []
        this.lineChartsOptions.xAxis[0].axisLine.lineStyle.color = '#000'
        this.lineChartsOptions.yAxis[0].axisLine.lineStyle.color = '#000'
        this.lineChartsOptions.grid.left = 80
        this.askListDatas()
        this.askTreeDatas()
        this.askEnergyUse()
        this.askCollectDataType()
        this.askCollectBaseDatas()
      },
      methods:{
        statusFormatter(row, column) {
          if(row.status === 0){
            return '缺失'
          } else {
            return '正常'
          }
        },
        inputTypeFormatter(row, column) {
          if(row.inputType === 1){
            return '管理信息系统'
          } else if (row.inputType === 2) {
            return '生产监控管理系统'
          } else if (row.inputType === 3) {
            return '分布式控制系统'
          } else if (row.inputType === 4) {
            return '现场仪表'
          } else if (row.inputType === 5) {
            return '手工填报'
          } else{
            return ''
          }
        },
        statTypeFormatter(row, column) {
          if(row.statType === 0){
            return '实时'
          } else if (row.statType === 1) {
            return '日'
          } else if (row.statType === 2) {
            return '月'
          } else if (row.statType === 3) {
            return '年'
          } else{
            return ''
          }
        },
        parentNodeTypeFormatter(row, column) {
          if(row.parentNodeType === 1){
            return '全厂'
          } else if (row.parentNodeType === 2) {
            return '工序'
          } else if (row.parentNodeType === 3) {
            return '工序单元'
          } else if (row.parentNodeType === 4) {
            return '能耗设备'
          } else{
            return ''
          }
        },
        onPickerChange(value){
          this.histotyDate = value
          this.askHistoryDatas()
        },
        onExportPickerChange(value){
          this.exportForm.exportDate = value
        },
        onExportSelectChange(value){
          this.exportForm.statType = value
          let dateTime = new DateTime()
          switch (value) {
            case 0:{
              this.exportPickerType = 'date'
              this.exportDateFormat = 'yyyy-MM-dd'
              this.exportForm.exportDate = dateTime.getDate2()
              break
            }
            case 1:{
              this.exportPickerType = 'date'
              this.exportDateFormat = 'yyyy-MM-dd'
              this.exportForm.exportDate = dateTime.getDate2()
              break
            }
            case 2:{
              this.exportPickerType = 'month'
              this.exportDateFormat = 'yyyy-MM'
              this.exportForm.exportDate = dateTime.getMonth()
              break
            }
            case 3:{
              this.exportPickerType = 'year'
              this.exportDateFormat = 'yyyy'
              this.exportForm.exportDate = dateTime.getYear()
              break
            }
          }
        },
        onFatherSelectChange(value){
          let _that = this
          _that.fatherOptions = []
          switch (value) {
            case 1:{
              _that.fatherCascadersForbidden = true
              break
            }
            case 2:{
              _that.fatherCascadersForbidden = false
              _that.doDatas(1)
              break
            }
            case 3:{
              _that.fatherCascadersForbidden = false
              _that.doDatas(2)
              break
            }
            case 4:{
              _that.doDatas(3)
              _that.fatherCascadersForbidden = false
              break
            }
          }
        },
        onCollectTypeChange(value){
         if (this.validateGlobal.isEmpty(this.collectTypeFields)) {
            return
          }
         let obj = this.collectTypeFields.find(
            item=>{
              return item.value == value
            }
          )
          let tag = obj.code
          if (tag == "01" || tag == "02" || tag == "05" || tag =="06") {
            this.askEneygyVarieties()
         }
         if (tag =="03" || tag == "07"){
            this.askEnergyMedium()
         }
         if (tag =="04") {
           this.askUnPower()
         }
         if (tag =="08") {
           this.askEnergyEff()
         }
         if (tag =="09") {
           this.askBusiness()
         }
          if (tag =="10") {
           this.askOther()
          }
        },
        resetAddForm(){
          this.ruleFormAdd ={
              nodeName: "",
              parentNodeType: '',
              collectedDataTypeId: "",
              processId: [],
              inputType: '',
              statType: '',
              subclassId: [],
              energyUseId:[]
          }
          this.fatherCascadersForbidden = false
          this.fatherOptions=[]
          this.collectChildOptions=[]
        },
        resetSeacherForm(){
          this.seacherFrom = {
            inputType:'',
            statType:'',
            parentNodeType:'',
            status:''
          }
        },
        resetSettingForm(){
          this.settingForm.settingTagName = ''
          this.settingForm.settingVarieties = ''
        },
        handleHistory(index,item){
          // this.queryHistoryId = item.id
          let dateTime = new DateTime()
          if (!this.historyDialogShow){
            this.historyDialogShow = true
          }
          if (item.statType === 0) {
            this.infoForbidden = false
            this.pickerType = 'date'
            this.histotyDateFormat = 'yyyy-MM-dd'

            console.log("new DateTime()",dateTime)
            this.histotyDate = dateTime.getDate2()
          }else if (item.statType === 1) {
            this.infoForbidden = false
            this.pickerType ='month'
            this.histotyDateFormat = 'yyyy-MM'
            this.histotyDate = dateTime.getMonth()
          }else if (item.statType === 2){
            console.log('dateTime.getYear()',dateTime.getYear())
            this.infoForbidden = false
            this.pickerType = 'year'
            this.histotyDateFormat = 'yyyy'
            this.histotyDate = dateTime.getYear()
          }else{
            this.infoForbidden = true
            this.pickerType = 'year'
            this.histotyDateFormat = 'yyyy'
            this.histotyDate = dateTime.getYear()
          }
          this.chooseId = item.id
          this.askHistoryDatas()
        },
        handleAdd(){
          if (!this.addDialogShow) {
            this.addDialogShow = true
          }
          this.resetAddForm()
        },
        handleExport(){
          if (!this.exportDialogShow) {
            this.exportDialogShow = true
          }
        },
        handleAddSubmit(formName){
          let _that = this
          this.$refs[formName].validate((valid) => {
            if (valid) {
              _that.postNewItem()
            } else {
              _that.$message('输入有误!');
              return false;
            }
          });
        },
        handleInfo(index, row) {
          console.log(index, row);
          if (!this.infoDialogShow) {
            this.infoDialogShow = true
          }
          this.askCollectDataInfo(row.id)
        },
        handleSearch(index, row){
          if (!this.searchDialogShow) {
            this.searchDialogShow = true
          }
          // this.resetSeacherForm()
        },
        handleSeacherSubmit(){
          this.searchDialogShow = false
          this.currentPage = 1
          this.askListDatas()
        },
        getStatTypeName(statType){
          if (statType === 0){
            return "实时"
          } if (statType === 1){
            return '日'
          } if (statType === 2){
            return "月"
          } if (statType === 0){
            return "年"
          }
        },
        handleExportSubmit(formName){
          let _that = this
          this.$refs[formName].validate((valid) => {
            if (valid) {
              let num = ''
              for(let i=0;i < 10;i++){
                num += Math.ceil(Math.random() * 10)
              }
              _that.fileName = _that.exportForm.exportDate + _that.getStatTypeName(_that.exportForm.statType) + num
              let url = this.ports.collectManage.collectData.exportForm
              let userId = sessionStorage.getItem("userId")
              let askInfo = {
                userId: userId,
                statType: _that.exportForm.statType,
                time:_that.exportForm.exportDate
              }
              this.http.postExcel(url,askInfo,res => {
                console.log(res)
                const link = document.createElement('a')
                let blob = new Blob([res.data],{type: 'application/vnd.ms-excel'});
                link.style.display = 'none'
                link.href = URL.createObjectURL(blob);
               /* let num = ''
                for(let i=0;i < 10;i++){
                  num += Math.ceil(Math.random() * 10)
                }
                link.setAttribute('download', num + '.xlsx')*/
                link.setAttribute('download', _that.fileName + '.xlsx')
                document.body.appendChild(link)
                link.click()
                document.body.removeChild(link)
              })
            } else {
              _that.$message('输入有误!');
              return false;
            }
          });
        },
        handleDelete(index, row) {
          console.log(index, row);
          if (!this.warnDialogShow) {
            this.warnDialogShow = true
          }
          this.deleteId = row.id
        },
        handleItemDelete(index, row) {
          console.log(index, row);
          this.settingForm.itemTableData.splice(index,1)
        },
        handleSetting(index, row) {
          console.log(index, row);
          if (!this.settingDialogShow) {
            this.settingDialogShow = true
          }
          this.currentNodeId = row.id
          this.askSettingInfo()
        },
        handleSettingInfo(){
          if (!this.validateGlobal.isEmpty(this.settingForm.itemTableData)
            && !this.validateGlobal.isEmpty(this.settingForm.calculateValue)) {
            this.postSettingForm()
          }else{
            this.$message('输入有误!')
          }
        },
        handlerDeleteForWarn(){
          this.askDelete()
        },
        handleFatherCascadersChange(value){

        },
        currentChange(currentPage){
          this.currentPage = currentPage;
          this.askListDatas()
        },
        addSettingItem(){
          if (this.settingForm.settingTagName && this.settingForm.settingVarieties) {
            let obj = {}
            obj.parameter = this.settingForm.settingTagName
            let settingItem = this.settingFields.find(
              item=>{
                return item.id == this.settingForm.settingVarieties
              }
            )
            obj.tagName = settingItem.detailTagName
            obj.attributeInfoId = settingItem.id
            this.settingForm.itemTableData.push(obj)
            this.resetSettingForm()
          }else{
            this.$message("输入有误!")
          }
        },
        askTreeDatas(){
          let _that = this
          let userId = sessionStorage.getItem("userId")
          let url = _that.ports.procedureManage.process.all
          let askData = {
            userId: userId,
          }
          this.http.get(url,askData, res => {
            console.log("treeDatas",res)
            if(!_that.validateGlobal.isEmpty(res) && res.code == 200){
              _that.treeDatas = res.data
            }else{
              _that.$message('数据获取失败!');
            }
          })
        },
        doDatas: function(level){
          let datas = this.treeDatas
          let arry = []
          for(let i=0;i<datas.length;++i){
            let obj = {}
            obj.label = datas[i].name
            obj.value = datas[i].id
            if (level === 2 || level === 3) {
              obj.children = []
            }
            arry.push(obj)
            if (level === 2 || level === 3){
              for(let j = 0;j < datas[i].processElements.length;++j){
                let obj2 = {}
                obj2.label = datas[i].processElements[j].name
                obj2.value = datas[i].processElements[j].id
                if (level === 3){
                  obj2.children = []
                }
                arry[i].children[j]=obj2
                if (level === 3) {
                  for(let z = 0;z < datas[i].processElements[j].facilityEntities.length;++z){
                    let obj3 = {}
                    obj3.label = datas[i].processElements[j].facilityEntities[z].name
                    obj3.value = datas[i].processElements[j].facilityEntities[z].id
                    arry[i].children[j].children[z] = obj3
                  }
                }
              }
            }
          }
          this.fatherOptions=arry
        },
        askCollectDataType(){
          let _that = this
          let userId = sessionStorage.getItem("userId")
          let url = _that.ports.collectManage.collectType.lists
          let askData = {
            userId: userId,
          }
          this.http.get(url,askData, res => {
            console.log("deviceLists",res)
            if(!_that.validateGlobal.isEmpty(res) && res.code == 200){
              _that.collectDataType = res.data
              let arry = []
              for(let i = 0;i<res.data.length;++i){
                let obj={}
                obj.label = res.data[i].name
                obj.value = res.data[i].id
                obj.code = res.data[i].code
                arry.push(obj)
              }
              _that.collectTypeFields = arry
            }else{
              _that.$message('列表获取失败!');
            }
          })
        },
        askEnergyUse(){
          let _that = this
          let userId = sessionStorage.getItem("userId")
          let url = _that.ports.energyVarieties.energyUse.lists
          let askData = {
            userId: userId,
          }
          this.http.get(url,askData, res => {
            if(!_that.validateGlobal.isEmpty(res) && res.code == 200){
              console.log("能源用途:",res.data)

              let arry = []
              for(let i=0;i<res.data.length;++i){
                let obj = {}
                obj.label = res.data[i].name
                obj.value = res.data[i].id
                obj.children = []
                arry.push(obj)
                  for(let j = 0;j < res.data[i].energyUseSubitemEntities.length;++j){
                    let obj2 = {}
                    obj2.label = res.data[i].energyUseSubitemEntities[j].name
                    obj2.value = res.data[i].energyUseSubitemEntities[j].id
                    arry[i].children[j]=obj2
                  }
              }
              this.energyUseOptions=arry
              console.log('能源用途2:',arry)
            }else{
              _that.$message('列表获取失败!');
            }
          })
        },
        askEneygyVarieties(){
          let _that = this
          let userId = sessionStorage.getItem("userId")
          let url = _that.ports.energyVarieties.energyVarieties.lists
          let askData = {
            userId: userId,
          }
          this.http.get(url,askData, res => {
            console.log("ennergyVarietiesLists",res)
            if(!_that.validateGlobal.isEmpty(res) && res.code == 200){
              let arry = []
              for(let i=0;i<res.data.length;++i){
                let obj = {}
                obj.label = res.data[i].name
                obj.value = res.data[i].id
                obj.children = []
                arry.push(obj)
                for(let j = 0;j < res.data[i].projectSubitemEntities.length;++j){
                  let obj2 = {}
                  obj2.label = res.data[i].projectSubitemEntities[j].name
                  obj2.value = res.data[i].projectSubitemEntities[j].id
                  arry[i].children[j]=obj2
                }
              }
              this.collectChildOptions=arry
            }else{
              _that.$message('列表获取失败!');
            }
          })
        },
        askEnergyMedium(){
          let _that = this
          let userId = sessionStorage.getItem("userId")
          let url = _that.ports.energyVarieties.medium.lists
          let askData = {
            userId: userId,
          }
          this.http.get(url,askData, res => {
            if(!_that.validateGlobal.isEmpty(res) && res.code == 200){
              let arry = []
              for(let i=0;i<res.data.length;++i){
                let obj = {}
                obj.label = res.data[i].name
                obj.value = res.data[i].id
                obj.children = []
                arry.push(obj)
                for(let j = 0;j < res.data[i].subitems.length;++j){
                  let obj2 = {}
                  obj2.label = res.data[i].subitems[j].name
                  obj2.value = res.data[i].subitems[j].id
                  arry[i].children[j]=obj2
                }
              }
              this.collectChildOptions=arry
            }else{
              _that.$message('列表获取失败!');
            }
          })
        },
        askUnPower(){
          let _that = this
          let userId = sessionStorage.getItem("userId")
          let url = _that.ports.energyVarieties.nonEnergy.lists
          let askData = {
            userId: userId,
          }
          this.http.get(url,askData, res => {
            if(!_that.validateGlobal.isEmpty(res) && res.code == 200){
              let arry = []
              for(let i=0;i<res.data.length;++i){
                let obj = {}
                obj.label = res.data[i].name
                obj.value = res.data[i].id
                obj.children = []
                arry.push(obj)
                for(let j = 0;j < res.data[i].subitems.length;++j){
                  let obj2 = {}
                  obj2.label = res.data[i].subitems[j].name
                  obj2.value = res.data[i].subitems[j].id
                  arry[i].children[j]=obj2
                }
              }
              this.collectChildOptions=arry
            }else{
              _that.$message('列表获取失败!');
            }
          })
        },
        askEnergyEff(){
          let _that = this
          let userId = sessionStorage.getItem("userId")
          let url = _that.ports.energyVarieties.efficiency.lists
          let askData = {
            userId: userId,
          }
          this.http.get(url,askData, res => {
            if(!_that.validateGlobal.isEmpty(res) && res.code == 200){
              let arry = []
              for(let i=0;i<res.data.length;++i){
                let obj = {}
                obj.label = res.data[i].name
                obj.value = res.data[i].id
                obj.children = []
                arry.push(obj)
                for(let j = 0;j < res.data[i].subitems.length;++j){
                  let obj2 = {}
                  obj2.label = res.data[i].subitems[j].name
                  obj2.value = res.data[i].subitems[j].id
                  arry[i].children[j]=obj2
                }
              }
              this.collectChildOptions=arry
            }else{
              _that.$message('列表获取失败!');
            }
          })
        },
        askBusiness(){
          let _that = this
          let userId = sessionStorage.getItem("userId")
          let url = _that.ports.energyVarieties.business.lists
          let askData = {
            userId: userId,
          }
          this.http.get(url,askData, res => {
            if(!_that.validateGlobal.isEmpty(res) && res.code == 200){
              let arry = []
              for(let i=0;i<res.data.length;++i){
                let obj = {}
                obj.label = res.data[i].name
                obj.value = res.data[i].id
                obj.children = []
                arry.push(obj)
                for(let j = 0;j < res.data[i].subitems.length;++j){
                  let obj2 = {}
                  obj2.label = res.data[i].subitems[j].name
                  obj2.value = res.data[i].subitems[j].id
                  arry[i].children[j]=obj2
                }
              }
              this.collectChildOptions=arry
            }else{
              _that.$message('列表获取失败!');
            }
          })
        },
        askOther(){
          let _that = this
          let userId = sessionStorage.getItem("userId")
          let url = _that.ports.energyVarieties.other.lists
          let askData = {
            userId: userId,
          }
          this.http.get(url,askData, res => {
            if(!_that.validateGlobal.isEmpty(res) && res.code == 200){
              let arry = []
              for(let i=0;i<res.data.length;++i){
                let obj = {}
                obj.label = res.data[i].name
                obj.value = res.data[i].id
                obj.children = []
                arry.push(obj)
                for(let j = 0;j < res.data[i].subitems.length;++j){
                  let obj2 = {}
                  obj2.label = res.data[i].subitems[j].name
                  obj2.value = res.data[i].subitems[j].id
                  arry[i].children[j]=obj2
                }
              }
              this.collectChildOptions=arry
            }else{
              _that.$message('列表获取失败!');
            }
          })
        },
        postNewItem(){
          let _that = this
          let userId = sessionStorage.getItem("userId")
          let url = _that.ports.collectManage.collectData.add + '?userId=' + userId
          let processId = ''
          if (!_that.validateGlobal.isEmpty( _that.ruleFormAdd.processId)) {
            processId = _that.ruleFormAdd.processId[_that.ruleFormAdd.processId.length -1]
          }

          let askData = {
            nodeName: _that.ruleFormAdd.nodeName,
            parentNodeType: _that.ruleFormAdd.parentNodeType,
            collectedDataTypeId: _that.ruleFormAdd.collectedDataTypeId,
            processId:processId,
            inputType: _that.ruleFormAdd.inputType,
            statType: _that.ruleFormAdd.statType,
            subclassId: _that.ruleFormAdd.subclassId[_that.ruleFormAdd.subclassId.length -1] ,
            energyUseClassificationId: _that.ruleFormAdd.energyUseId[0] ,
            energyUseSubitemId:  _that.ruleFormAdd.energyUseId[1]
          }
          this.http.post(url,askData, res => {
            if(!_that.validateGlobal.isEmpty(res) && res.code == 200){
              _that.$message('添加成功!');
              _that.addDialogShow = false
              _that.askListDatas()
            }else{
              _that.$message('新增失败!');
            }
          })
        },
        askListDatas(){
          let _that = this
          let userId = sessionStorage.getItem("userId")
          let url = _that.ports.collectManage.collectData.lists
          let askData = {
            userId: userId,
            current: _that.currentPage,
            size: _that.pageSize,
            inputType:_that.seacherFrom.inputType,
            statType:_that.seacherFrom.statType,
            parentNodeType:_that.seacherFrom.parentNodeType,
            status:_that.seacherFrom.status
          }
          this.http.get(url,askData, res => {

            if(!_that.validateGlobal.isEmpty(res) && res.code == 200){
              _that.tableData = res.data.records
              _that.paginationCount = res.data.total
            }else{
              _that.$message('列表获取失败!');
            }
          })
        },
        askCollectBaseDatas() {
          let _that = this
          let userId = sessionStorage.getItem("userId")
          let url = _that.ports.collectManage.collectBaseData.lists
          let askData = {
            userId: userId,
            current: 1,
            size: 1000
          }
          this.http.get(url,askData, res => {
            if(!_that.validateGlobal.isEmpty(res) && res.code == 200){
              _that.settingFields = res.data.records
            }else{
              _that.$message('列表获取失败!');
            }
          })
        },
        askSettingInfo(){
          let _that = this
          let userId = sessionStorage.getItem("userId")
          let url = _that.ports.collectManage.collectData.settingInfo
          let askData = {
            userId: userId,
            dataCollectedNodeId: _that.currentNodeId,
          }
          this.http.get(url,askData, res => {
            if(!_that.validateGlobal.isEmpty(res) && res.code == 200){
               _that.settingForm.itemTableData = res.data.collectedParameterConfigurationEntities
              _that.settingForm.calculateValue = res.data.parameterCalculateRelationship
              // _that.settingFields = res.data.records
            }else{
              _that.$message('列表获取失败!');
            }
          })
        },
        postSettingForm(){
          let _that = this
          let userId = sessionStorage.getItem("userId")
          let url = _that.ports.collectManage.collectData.settingEdit + '?userId=' + userId
          let processId = ''
          if (!_that.validateGlobal.isEmpty( _that.ruleFormAdd.processId)) {
            processId = _that.ruleFormAdd.processId[_that.ruleFormAdd.processId.length -1]
          }

          let askData = {
            id:_that.currentNodeId,
            parameterCalculateRelationship: _that.settingForm.calculateValue,
            collectedParameterConfigurationEntities:_that.settingForm.itemTableData
          }
          this.http.post(url,askData, res => {
            if(!_that.validateGlobal.isEmpty(res) && res.code == 200){
              _that.$message('添加成功!');
              _that.settingDialogShow = false
              _that.askListDatas()
            }else{
              _that.$message('新增失败!');
            }
          })
        },
        askCollectDataInfo(id){
          let _that = this
          let userId = sessionStorage.getItem("userId")
          let url = _that.ports.collectManage.collectData.info
          let askData = {
            userId: userId,
            id: id,
          }
          this.http.get(url,askData, res => {
            if(!_that.validateGlobal.isEmpty(res) && res.code == 200){
              _that.infoForm = res.data
              if (res.data.inputType === 1) {
                _that.infoForm.inputType = "管理信息系统"
              }else if (res.data.inputType === 2) {
                _that.infoForm.inputType = "生产监控管理系统"
              }else if (res.data.inputType === 3) {
                _that.infoForm.inputType = "分布式控制系统"
              }else if (res.data.inputType === 4) {
                _that.infoForm.inputType = "现场仪表"
              }else if (res.data.inputType === 5) {
                _that.infoForm.inputType = "手工填报"
              }else{
                _that.infoForm.inputType = ""
              }

              if (res.data.statType === 0) {
                _that.infoForm.statType = "实时"
              }else if (res.data.statType === 1) {
                _that.infoForm.statType = "日"
              }else if (res.data.statType === 2) {
                _that.infoForm.statType = "月"
              }else if (res.data.statType === 3) {
                _that.infoForm.statType = "年"
              }else{
                _that.infoForm.statType = ""
              }

              if (res.data.parentNodeType === 1) {
                _that.infoForm.parentNodeType = "全厂"
              }else if (res.data.parentNodeType === 2) {
                _that.infoForm.parentNodeType = "工序"
              }else if (res.data.parentNodeType === 3) {
                _that.infoForm.parentNodeType = "工序单元"
              }else if (res.data.parentNodeType === 4) {
                _that.infoForm.parentNodeType = "重点设备"
              }else{
                _that.infoForm.parentNodeType = ""
              }

             if (res.data.valid === 1) {
                _that.infoForm.valid = "有效数据"
              }else{
                _that.infoForm.valid = "可疑数据"
              }
            }else{
              _that.$message('列表获取失败!');
            }
          })
        },
        askHistoryDatas:function () {
          let _that = this
          let userId = sessionStorage.getItem("userId")
          let url = _that.ports.collectManage.collectData.history
          let askData = {
            userId: userId,
            id: _that.chooseId,
            time:_that.histotyDate,
          }
          this.http.get(url,askData, res => {
            if(!_that.validateGlobal.isEmpty(res) && res.code == 200){
              _that.lineChartsOptions.xAxis[0].data = res.data.times
              _that.lineChartsOptions.series[0].data = res.data.values
              _that.$refs.cptsCdsLineChart.drawLineGraph('cpts-cds-chart',_that.lineChartsOptions)
            }else{
              _that.$message('请求失败!');
            }
          })
        },
        askDelete(){
          let _that = this
          let userId = sessionStorage.getItem("userId")
          let url = _that.ports.collectManage.collectData.delete
          let askData = {
            userId: userId,
            id: _that.deleteId,
          }
          this.http.get(url,askData, res => {
            if(!_that.validateGlobal.isEmpty(res) && res.code == 200){
              _that.$message('删除成功!');
              _that.warnDialogShow = false
              _that.askListDatas()
            }else{
              _that.$message('删除失败!');
            }
          })
        }
      }
    }
</script>

<style lang="scss">

  #cpts-collect-datas{

    > .el-card{
      margin: 20px 20px 0 20px;
      height: 780px;
    }

    .el-dialog{
      height: 680px;
      width: 1400px;
    }

    .cdc-submit-layout{
      display: flex;
      justify-content: center;
    }

    .el-collapse-item__content {
      padding-bottom: 20px;
    }

    .el-input__inner {
      width: 300px;
    }

    #cpts-cds-chart{
      height: 500px;
      width: 100%;
    }
  }

</style>
